<tc_include file="Public:header" />
<title>我的优惠券</title>
</head>
<body ontouchstart>
<div class="container">
	<div class="weui-cell weui-navbar-header">
	    <!--navbar-->
	    <div class="weui_navbar my-account">
        <div class="weui_navbar_item weui_bar_item_on" onclick="coupon(0)">
        	<span>未使用 (3)</span>
        </div>
        <div class="weui_navbar_item" onclick="coupon(1)">
        	<span>已使用(2)</span>
        </div>
        <div class="weui_navbar_item" onclick="coupon(2)">
        	<span>已过期(8)</span>
        </div>
	    </div>
	    <!--navbar end-->
	</div>
	<div class="weui-tab__panel my-coupon-list" id="orderlist">
	    <div class="weui-tab__content" style="display: block;">
		    <!--list-->
			<foreach name="orderlist.data.couponList" item="vo">
			<div class="weui-form-preview">
				 <div class="weui-cell">
				 	 <div class="weui-cell__hd">
			             <i class="icon iconfont icon-gift"></i>
			         </div>
			         <div class="weui-cell__bd">
			             <h4 class="weui-media-box__title">{$vo.couponName}</h4>
			             <p class="weui-media-box__desc">{$vo.startDate}-{$vo.endDate}</p>
			         </div>
			         <div class="weui-cell__ft text-center text-gray333"><small>¥</small><big>{$vo.amount}</big></div>
			     </div>
			     <div class="weui-cell">
			         <div class="weui-cell__bd">
			            <h4 class="weui-media-box__title">{$vo.couponDesc}</h4>
			         </div>
			     </div>
		    </div>
			</foreach>
	    </div>
	</div>
</div>
<script src="__PUBLIC__/home/js/zepto.min.js"></script>
<script src="__PUBLIC__/home/js/weui.min.js"></script>
<script>
	 $(function(){
        $('.weui_navbar_item').on('click', function () {
        	  var _this=$(this).index();
            $(this).addClass('weui_bar_item_on').siblings('.weui_bar_item_on').removeClass('weui_bar_item_on');
        });
    });
	 function coupon(status){
         $.ajax({
             url:"{:U('coupon/read')}",
             type:"get",
             dataType:"json",
             data:{
                 "status":status,
                 "pageSize":10,
                 "pageIndex":1
     			 },
			 success:function (result) {
                 var statu = ['未使用','已使用','已过期'];
                 var list = "";
				 var data = result.data.couponList;
                 $.each(data,function (i,value) {
                     list += "<div class='weui-form-preview'>";
                     list += "<div class='weui-cell'>";
                     list += "<div class='weui-cell__hd'>";
                     list += "<i class='icon iconfont icon-gift'></i>";
                     list += "</div>";
                     list += "<div class='weui-cell__bd'>";
                     list += "<h4 class='weui-media-box__title'>" + value.couponName + "</h4>";
                     list += "<p class='weui-media-box__desc'>"+ value.startDate + "-" + value.endDate +"</p>";
                     list += "</div>";
                     if (value.status == 0){
                         list += "<div class='weui-cell__ft text-center text-gray333'><small>¥</small><big>" + value.amount + "</big></div>"
					 }else{
                         list += "<div class='weui-cell__ft text-center text-gray333'><big>" + statu[value.status] + "</big></div>";
					 }
                     list += "</div>";
                     list += "<div class='weui-cell'>";
                     list += "<div class='weui-cell__bd'>";
                     list += "<h4 class='weui-media-box__title'>" + value.couponDesc + "</h4>";
                     list += "</div>";
                     list += "</div>";
                     list += "</div>";
                     list += "</foreach>";
				 })
                 $("#orderlist").html(list);
             }
     	 })
	 }
</script>
</body>
</html>
